<!DOCTYPE html>
<html lang="zh-CN">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
		<title>YTUI-BUTTON</title>
		<link rel="stylesheet" href="css/ytui.css" />
		<script src="js/html-size-calculation.js"></script>

	</head>

	<body class="header-fixed nav-fixed">
		<header class="header-bar bg-main">
			<h2 class="header-title">YTUI</h2>
		</header>
		<section>
			<ul class="list">
				<li>
					<a href="html/grid.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">栅格</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/headerBar.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">头部</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/nav.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">导航</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/slider.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">slider</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/list.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">列表</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/userList.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">用户列表</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/badge.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">标记</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/button.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">按钮</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/dialog.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">弹框</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/fontIcon.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">字体图标</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/form.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">表单</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/range.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">滑块</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/lattice.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">格子</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/card.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">Card</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>

				<li>
					<a href="html/loader.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">加载</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/progress.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">进度条</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/switch.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">开关</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/tabsNav.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">tabsNav</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
				<li>
					<a href="html/search.html" class="yt yt-ac">
						<h3 class="yt-f1 list-title">搜索</h3>
						<i class="icon icon-next"></i>
					</a>
				</li>
			</ul>
		</section>
		<nav class="nav bt">
			<a href="index.html" class="nav-item active">
				<i class="icon icon-menu fz42"></i>
				<span class="fz24">组件</span>
			</a>
			<a href="templet.html" class="nav-item">
				<i class="icon icon-module"></i>
				<span class="fz24 db">模板</span>
			</a>
			<a href="#" class="nav-item">
				<i class="icon icon-more"><span class="bages-s"></span></i>
				<span class="fz24 db">关于</span>
			</a>
		</nav>
	</body>

</html>